<template>
	<el-dialog :title="!dataForm.id ? '新建' :  isDetail ? '详情':'处理'" :close-on-click-modal="false" :visible.sync="visible" class="JNPF-dialog JNPF-dialog_center" lock-scroll width="600px">
		<el-row :gutter="15" class="" >
			<el-form ref="elForm" :model="dataForm" size="medium" label-width="100px" label-position="right" :disabled="!!isDetail" :rules="rules">
				
				<el-col :span="24">
					<el-form-item label="处置人员" prop="czry" >
						<el-input v-model="dataForm.czry" placeholder="请输入" disabled clearable :style='{"width":"100%"}' prefix-icon="" suffix-icon="" >
							<template slot="prepend"></template>
							<template slot="append"></template>
						</el-input>
					</el-form-item>
				</el-col>
        	<el-col :span="24">
					<el-form-item label="处置时间" prop="czsj" >
						<el-date-picker v-model="dataForm.czsj" placeholder="请选择" disabled clearable :style='{"width":"100%"}' type="datetime" format="yyyy-MM-dd HH:mm:ss" value-format="timestamp" >
						</el-date-picker>
					</el-form-item>
				</el-col>
        <el-col :span="24">
           <el-form-item label="处置结果" prop="czjg" >
						<el-input v-model="dataForm.czjg" placeholder="请输入" show-word-limit :style='{"width":"100%"}' type="textarea" :autosize='{"minRows":4,"maxRows":4}' >
						</el-input>
					</el-form-item>
        </el-col>
			</el-form>
		</el-row>
		<span slot="footer" class="dialog-footer">
			<el-button @click="visible = false">取 消</el-button> 
			<el-button type="primary" @click="dataFormSubmit()" v-if="!isDetail">确 定</el-button>
		</span>
	</el-dialog>

</template>
<script>
import request from '@/utils/request'
import { mapState, mapGetters } from "vuex";
import {getDictionaryDataSelector}from '@/api/systemData/dictionary'
import {previewDataInterface}from '@/api/systemData/dataInterface'
export default {
    computed: {
      ...mapState({
        layoutType: state => state.settings.layoutType
      }),
      ...mapGetters(['userInfo'])
    },
    data() {
      return {
        visible: false,
        isDetail: false,
        dataForm: {
            czry:undefined,
            czsj:undefined,
            czjg: undefined,
        },
        rules: {

        },
		    clztOptions:[{"fullName":"未处理","id":"0"},{"fullName":"已处理","id":"1"},{"fullName":"忽略","id":"2"},{"fullName":"确认","id":"3"}],


      }
    },
    created() {
      
    },
    methods: {

      goBack() {
        this.$emit('refresh')
      },
      init(id, isDetail) {
 
        this.dataForm.id = id || 0;
        this.visible = true;
        this.isDetail = isDetail || false;
        this.$nextTick(() => {
          this.$refs['elForm'].resetFields();
          if (this.dataForm.id) {
            request({
              url: '/api/System/AlarmEvent/' + this.dataForm.id,
              method: 'get'
            }).then(res =>{
              this.dataForm = res.data;
              this.dataForm.czry = this.userInfo.userName;
            })
          }
        })
      },
      // 表单提交
      dataFormSubmit() {

        this.$refs['elForm'].validate((valid) => {
          if (valid) {
               let query = {
                   ...this.dataForm,
                   clzt: 1
               };
              request({
                url: '/api/System/AlarmEvent/' + this.dataForm.id,
                method: 'PUT',
                data: query
              }).then((res) =>{
                this.$message({
                  message: res.msg,
                  type: 'success',
                  duration: 1000,
                  onClose: () =>{
                    this.visible = false;
                    this.$emit('refresh', true);
                  }
                })
              })
          }
        })
      },

    }
}
</script>